<template>
	<div class="department box">
		<el-card style="display: flex; height: 30px; padding: 10px 15px; background: #fff; box-shadow: none; border: #e1e4eb">
			<div class="sele" style="width: 100%; display: flex; justify-content: space-between" id="card">
				<el-form inline :model="formInline" size="mini">
					<el-form-item label>
						<el-input
								v-model="formInline.deptName"
								placeholder="部门名称"
								clearable
								style="background-color: #ffffff; width: 150px"
								@input="formInline.deptName = verifyfilter('char', formInline.deptName)"
						></el-input>
					</el-form-item>

					<el-form-item>
						<el-select
								v-model="formInline.delFlag"
								filterable
								clearable
								placeholder="部门状态"
								style="background-color: #ffffff; width: 150px"
						>
							<el-option label="在用" value="0"></el-option>
							<el-option label="停用" value="1"></el-option>
						</el-select>
					</el-form-item>
					<el-form-item>
						<el-select v-model="type" placeholder="公司类型" multiple filterable size="mini" style="width: 200px">
							<el-option label="内部公司" value="00"></el-option>
							<el-option label="外部公司" value="01"></el-option>
						</el-select>
					</el-form-item>
					<el-form-item>
						<!-- <el-button type="primary" @click="onSubmit" size="mini" icon="el-icon-search">查询</el-button> -->
						<el-button type="primary" @click="searchClick" size="mini" icon="el-icon-search">查询</el-button>
					</el-form-item>
				</el-form>
<!--				<el-button-group class="form_cionBtn">
          <el-button v-hasPermi="['system:dept:insert']" size="mini" type="primary" icon="el-icon-plus" @click="create">新建</el-button>
				</el-button-group>-->
			</div>
		</el-card>
		<template>
			<div style="height: 1px; background: rgb(225, 228, 235)"></div>

			<el-table
					ref="multipleTable"
					:data="tableData"
					style="width: 100%"
					border
					row-key="id"
					:height="tableHeight"
					highlight-current-row
					stripe
					:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
					lazy
					:load="getChildren"
					@expand-change="expandChange"
			>
				<el-table-column prop="name" label="部门名称" sortable width="200px"></el-table-column>
				<el-table-column label="类型">
					<template slot-scope="scope">{{ scope.row.type == "00" ? "内部" : "外部" }}</template>
				</el-table-column>
				<el-table-column prop="manager" show-overflow-tooltip label="责任人"></el-table-column>
				<el-table-column prop="phone" label="联系方式"></el-table-column>
				<el-table-column label="虚拟公司">
					<template slot-scope="scope">{{ scope.row.isVirtual == "00" ? "虚拟" : "非虚拟" }}</template>
				</el-table-column>
				<el-table-column prop="state" label="状态">
					<template slot-scope="scope">
						<el-tag type="success" round size="mini" plain v-show="scope.row.state == 0">正常</el-tag>
						<el-tag type="danger" round size="mini" plain v-show="scope.row.state == 1">停用</el-tag>
					</template>
				</el-table-column>
				<el-table-column prop="sortNum" label="排序" sortable></el-table-column>
				<el-table-column width="260px" label="操作" header-align="center" fixed="right">
					<template slot-scope="scope">
						<el-button
								size="mini"
								style="border: none; background-color: transparent"
                v-if="scope.row.parentId !== '0'"
								@click="handleCreate(scope.$index, scope.row)"
                v-hasPermi="['system:dept:insert']"
						>
							<!-- <i class="iconfont icon-liebiaotubiao_liebiaoxinzeng" style="color:#46C484"></i> 新增 -->
							<span style="color: #36ba2b">
								<i class="iconfont icon-1-06"></i>
								<span style="padding-left: 5px">新增</span>
							</span>
						</el-button>
						<el-button
								size="mini"
								style="border: none; background-color: transparent"
                v-if="scope.row.parentId !== '0' && scope.row.parentId !== '102'"
								@click="handleEdit(scope.$index, scope.row)"
                v-hasPermi="['system:dept:update']"
						>
							<span style="color: #0b6cd6">
								<i class="iconfont icon-1-07"></i>
								<span style="padding-left: 5px">编辑</span>
							</span>
						</el-button>
						<el-button
								style="border: none; background-color: transparent"
								size="mini"
                v-if="scope.row.parentId !== '0' && scope.row.parentId !== '102'"
								@click="handleDelete(scope.$index, scope.row)"
                v-hasPermi="['system:dept:delete']"
						>
							<!-- <i class="iconfont icon-tubiao_liebiaoshanchu" style="color:#DA2821"></i>删除 -->
							<span style="color: #f75e5e">
								<i class="iconfont icon-1-08"></i>
								<span style="padding-left: 5px">删除</span>
							</span>
						</el-button>
					</template>
				</el-table-column>
			</el-table>
		</template>
		<!-- 部门抽屉弹出 -->
		<el-drawer
				:visible.sync="dialog"
				title="修改部门信息"
				direction="rtl"
				size="25%"
				:before-close="handleClose"
				custom-class="demo-drawer"
				ref="drawer"
		>
			<div class="demo-drawer__content" style="margin-top: 30px">
				<el-form :model="form" ref="addDeptForm" :rules="companyRules">
					<el-form-item label="部门名称" :label-width="formLabelWidth" prop="deptName">
						<el-input
								v-model="form.deptName"
								autocomplete="off"
								size="mini"
								@input="form.deptName = verifyfilter('char', form.deptName)"
						></el-input>
					</el-form-item>
					<el-form-item label="所属公司" :label-width="formLabelWidth">
						<el-input v-model="form.companyName" autocomplete="off" size="mini" readonly></el-input>
					</el-form-item>
					<el-form-item label="虚拟部门" :label-width="formLabelWidth" prop="isVirtual">
						<el-radio-group :disabled="vflag" v-model="form.isVirtual">
							<el-radio label="虚拟" size="mini"></el-radio>
							<el-radio label="非虚拟" size="mini"></el-radio>
						</el-radio-group>
					</el-form-item>
					<el-form-item label="是否为项目组" :label-width="formLabelWidth">
						<el-radio-group v-model="form.isProject">
							<el-radio label="1">是</el-radio>
							<el-radio label="0">否</el-radio>
						</el-radio-group>
					</el-form-item>

					<el-form-item label="是否机械队" :label-width="formLabelWidth">
            <el-radio-group v-model="form.isMachine">
              <el-radio label="1">是</el-radio>
              <el-radio label="0">否</el-radio>
            </el-radio-group>
					</el-form-item>

          <el-form-item label="是否劳务队" :label-width="formLabelWidth">
            <el-radio-group v-model="form.islabor">
              <el-radio label="1">是</el-radio>
              <el-radio label="0">否</el-radio>
            </el-radio-group>
          </el-form-item>

					<el-form-item label="部门类型" :label-width="formLabelWidth">
						<el-select v-model="form.type" placeholder filterable size="mini" style="width: 180px">
							<el-option label="内部公司" value="00"></el-option>
							<el-option label="外部公司" value="01"></el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="负责人" :label-width="formLabelWidth" prop="manager">
						<el-input
								v-model="form.manager"
								autocomplete="off"
								size="mini"
								style="width: 180px"
								@input="form.manager = verifyfilter('char', form.manager)"
						></el-input>
					</el-form-item>
					<el-form-item label="联系方式" :label-width="formLabelWidth" prop="phone">
						<el-input
								v-model="form.phone"
								autocomplete="off"
								size="mini"
								style="width: 180px"
								@input="form.phone = verifyfilter('char', form.phone)"
						></el-input>
					</el-form-item>
					<el-form-item label="排序" :label-width="formLabelWidth" prop="sortNum">
						<el-input
								v-model="form.sortNum"
								autocomplete="off"
								size="mini"
								@input="form.sortNum = verifyfilter('char', form.sortNum)"
						></el-input>
					</el-form-item>
					<el-form-item label="状态" style="padding-left: 78px">
						<el-switch v-model="form.delFlag" active-value="0" active-text="启用" inactive-value="1" inactive-text="停用" />
					</el-form-item>
				</el-form>
			</div>
			<div class="demo-drawer__footer">
				<el-button size="small" type="primary" @click="editDeptenter" :loading="loading">
					{{ loading ? "提交中 ..." : "保 存" }}
				</el-button>
			</div>
		</el-drawer>

		<!-- 新增部门信息 -->
		<el-drawer
				:visible.sync="deptAdd"
				direction="rtl"
				title="新增部门信息"
				:before-close="handleClose"
				custom-class="demo-drawer"
				ref="drawer"
		>
			<el-form :model="deptData" :rules="companyRules" ref="editForm" style="padding: 20px">
				<el-form-item label="部门名称" :label-width="formLabelWidth" prop="deptName">
					<el-input
							v-model="deptData.deptName"
							autocomplete="off"
							@input="deptData.deptName = verifyfilter('char', deptData.deptName)"
					></el-input>
				</el-form-item>
				<el-form-item :label="deptOrCom" :label-width="formLabelWidth">
					<el-input v-model="deptData.companyName" autocomplete="off" readonly></el-input>
				</el-form-item>
				<el-form-item label="虚拟部门" :label-width="formLabelWidth">
					<el-radio-group :disabled="vflag" v-model="deptData.isVirtual">
						<el-radio label="虚拟" size="small"></el-radio>
						<el-radio label="非虚拟" size="small"></el-radio>
					</el-radio-group>
				</el-form-item>
				<el-form-item label="是否为项目组" :label-width="formLabelWidth">
					<el-radio-group v-model="deptData.isProject">
						<el-radio label="1">是</el-radio>
						<el-radio label="0">否</el-radio>
					</el-radio-group>
				</el-form-item>

        <el-form-item label="是否为劳务队" :label-width="formLabelWidth">
          <el-radio-group v-model="deptData.islabor">
            <el-radio label="1">是</el-radio>
            <el-radio label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="是否为机械队" :label-width="formLabelWidth">
          <el-radio-group v-model="deptData.isMachine">
            <el-radio label="1">是</el-radio>
            <el-radio label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>

				<el-form-item label="部门类型" :label-width="formLabelWidth">
					<el-select v-model="deptData.type" placeholder filterable style="width: 100%">
						<el-option label="内部" value="00"></el-option>
						<el-option label="外部" value="01"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="负责人" :label-width="formLabelWidth" prop="manager">
					<el-input
							v-model="deptData.manager"
							autocomplete="off"
							@input="deptData.manager = verifyfilter('char', deptData.manager)"
					></el-input>
				</el-form-item>
				<el-form-item label="联系方式" :label-width="formLabelWidth" prop="phone">
					<el-input
							v-model="deptData.phone"
							autocomplete="off"
							@input="deptData.phone = verifyfilter('char', deptData.phone)"
					></el-input>
				</el-form-item>
				<el-form-item label="排序" :label-width="formLabelWidth" prop="sortNum">
					<el-input
							v-model="deptData.sortNum"
							autocomplete="off"
							@input="deptData.sortNum = verifyfilter('char', deptData.sortNum)"
					></el-input>
				</el-form-item>
				<el-form-item label="状态" style="padding-left: 78px">
					<el-switch v-model="deptData.delFlag" active-value="0" active-text="启用" inactive-value="1" inactive-text="停用" />
				</el-form-item>
			</el-form>

			<div class="demo-drawer__footer">
				<el-button type="primary" size="small" @click="addDeptenter" :loading="loading">
					{{ loading ? "提交中 ..." : "保 存" }}
				</el-button>
			</div>
		</el-drawer>

		<!-- 公司右侧弹出 -->
		<el-drawer :visible.sync="dialogtwo" direction="rtl" :before-close="handleClose" title="修改公司信息" ref="drawer">
			<el-form :model="formtwo" :rules="companyRules" ref="companyEditRules" style="padding: 20px">
				<el-form-item label="公司名称" :label-width="formLabelWidth" prop="name">
					<el-input
							v-model="formtwo.name"
							autocomplete="off"
							@input="formtwo.name = verifyfilter('char', formtwo.name)"
					></el-input>
				</el-form-item>
				<el-form-item label="上级公司" :label-width="formLabelWidth">
					<el-cascader
							placeholder="上级公司"
							:options="companyData"
							:props="optionProps"
							change-on-select
							@change="casChange(parentId)"
							v-model="parentId"
							filterable
							style="width: 100%"
					></el-cascader>
				</el-form-item>
				<el-form-item label="公司类型" :label-width="formLabelWidth" prop="type">
					<el-select v-model="formtwo.type" filterable style="width: 100%">
						<el-option label="内部公司" value="00"></el-option>
						<el-option label="外部公司" value="01"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="是否作业公司" :label-width="formLabelWidth" prop="type">
					<el-radio-group v-model="formtwo.isWorkComp">
						<el-radio label="1">是</el-radio>
						<el-radio label="0">否</el-radio>
					</el-radio-group>
				</el-form-item>
				<el-form-item label="是否理货公司" :label-width="formLabelWidth">
					<el-radio-group v-model="formtwo.istally">
						<el-radio label="1">是</el-radio>
						<el-radio label="0">否</el-radio>
					</el-radio-group>
				</el-form-item>

				<el-form-item label="负责人" :label-width="formLabelWidth" prop="manager">
					<el-input
							v-model="formtwo.manager"
							autocomplete="off"
							@input="formtwo.manager = verifyfilter('char', formtwo.manager)"
					></el-input>
				</el-form-item>

				<el-form-item label="虚拟公司" :label-width="formLabelWidth" prop="isVirtual">
					<el-radio-group :disabled="cvflag" v-model="formtwo.isVirtual">
						<el-radio label="虚拟"></el-radio>
						<el-radio label="非虚拟"></el-radio>
					</el-radio-group>
				</el-form-item>
				<el-form-item label="排序" :label-width="formLabelWidth" prop="sortNum">
					<el-input
							v-model="formtwo.sortNum"
							autocomplete="off"
							@input="formtwo.sortNum = verifyfilter('char', formtwo.sortNum)"
					></el-input>
				</el-form-item>
				<el-form-item label="联系方式" :label-width="formLabelWidth" prop="phone">
					<el-input
							v-model="formtwo.phone"
							autocomplete="off"
							@input="formtwo.phone = verifyfilter('char', formtwo.phone)"
					></el-input>
				</el-form-item>
				<el-form-item label="邮箱" :label-width="formLabelWidth" prop="email">
					<el-input v-model="formtwo.email" autocomplete="off"></el-input>
				</el-form-item>
				<el-form-item label="所在地址" :label-width="formLabelWidth">
					<el-input
							v-model="formtwo.address"
							autocomplete="off"
							@input="formtwo.address = verifyfilter('char', formtwo.address)"
					></el-input>
				</el-form-item>
				<el-form-item label="状态" :label-width="formLabelWidth">
					<el-switch v-model="formtwo.delFlag" active-value="0" inactive-value="1" active-text="启用" inactive-text="停用" />
				</el-form-item>
				<el-form-item label="备注" :label-width="formLabelWidth">
					<el-input
							type="textarea"
							v-model="formtwo.remark"
							style="width: 210px; margin-bottom: 70px"
							@input="formtwo.remark = verifyfilter('char', formtwo.remark)"
					></el-input>
				</el-form-item>
			</el-form>

			<div class="demo-drawer__footer">
				<el-button size="small" type="primary" @click="submitComEdit('companyEditRules')" :loading="loading">
					{{ loading ? "提交中 ..." : "保 存" }}
				</el-button>
			</div>
		</el-drawer>

		<!-- 公司新增弹出 -->
		<el-drawer :visible.sync="dialogVisible" title="新增公司信息" :before-close="handleClose" direction="rtl" size="45%" ref="drawer">
			<div class="dgsuemo-drawer__content">
				<el-col :span="12" style="overflow-y: auto; margin-top: 20px">
					<el-form :model="ruleForm" :rules="companyRules" ref="ruleForm">
						<el-form-item label="公司名称" :label-width="formLabelWidth" prop="name">
							<el-input
									v-model="ruleForm.name"
									autocomplete="off"
									@input="ruleForm.name = verifyfilter('char', ruleForm.name)"
							></el-input>
						</el-form-item>
						<el-form-item label="上级公司" :label-width="formLabelWidth">
							<el-input v-model="ruleForm.parentName" autocomplete="off" disabled></el-input>
						</el-form-item>
						<el-form-item label="公司类型" :label-width="formLabelWidth" prop="type">
							<el-select v-model="ruleForm.type" filterable style="width: 100%">
								<el-option label="内部公司" value="00"></el-option>
								<el-option label="外部公司" value="01"></el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="是否作业公司" :label-width="formLabelWidth">
							<el-radio-group v-model="ruleForm.isWorkComp">
								<el-radio label="1">是</el-radio>
								<el-radio label="0">否</el-radio>
							</el-radio-group>
						</el-form-item>
						<el-form-item label="是否理货公司" :label-width="formLabelWidth">
							<el-radio-group v-model="ruleForm.istally">
								<el-radio label="1">是</el-radio>
								<el-radio label="0">否</el-radio>
							</el-radio-group>
						</el-form-item>

						<el-form-item label="负责人" :label-width="formLabelWidth" prop="manager">
							<el-input
									v-model="ruleForm.manager"
									autocomplete="off"
									@input="ruleForm.manager = verifyfilter('char', ruleForm.manager)"
							></el-input>
						</el-form-item>
						<el-form-item label="虚拟公司" :label-width="formLabelWidth" prop="isVirtual">
							<el-radio-group v-model="ruleForm.isVirtual">
								<el-radio label="虚拟"></el-radio>
								<el-radio label="非虚拟"></el-radio>
							</el-radio-group>
						</el-form-item>
						<el-form-item label="排序" :label-width="formLabelWidth" prop="sortNum">
							<el-input
									v-model="ruleForm.sortNum"
									autocomplete="off"
									@input="ruleForm.sortNum = verifyfilter('number', ruleForm.sortNum)"
							></el-input>
						</el-form-item>
						<el-form-item label="联系方式" :label-width="formLabelWidth" prop="phone">
							<el-input
									v-model="ruleForm.phone"
									autocomplete="off"
									@input="ruleForm.phone = verifyfilter('char', ruleForm.phone)"
							></el-input>
						</el-form-item>
						<el-form-item label="邮箱" :label-width="formLabelWidth" prop="email">
							<el-input v-model="ruleForm.email" autocomplete="off"></el-input>
						</el-form-item>
						<el-form-item label="所在地址" :label-width="formLabelWidth">
							<el-input
									v-model="ruleForm.address"
									autocomplete="off"
									@input="ruleForm.address = verifyfilter('char', ruleForm.address)"
							></el-input>
						</el-form-item>
						<el-form-item label="状态" :label-width="formLabelWidth">
							<el-switch
									v-model="ruleForm.delFlag"
									active-value="0"
									inactive-value="1"
									active-text="启用"
									inactive-text="停用"
							/>
						</el-form-item>
						<el-form-item label="备注" :label-width="formLabelWidth">
							<el-input
									type="textarea"
									v-model="ruleForm.remark"
									style="width: 210px; margin-bottom: 70px"
									@input="ruleForm.remark = verifyfilter('char', ruleForm.remark)"
							></el-input>
						</el-form-item>
					</el-form>
				</el-col>
				<el-col :span="10" style="margin-top: 20px">
					<div class="right_title" style="margin-left: 10px; font-size: 14px; font-family: Microsoft YaHei">上级公司</div>
					<!-- 树形控件 -->
					<el-tree
							:data="companyTree"
							:props="treeProps"
							default-expand-all
							style="background-color: #f5f7fa"
							node-key="id"
							ref="ruleTree"
							@node-click="handleNodeClick"
					></el-tree>
				</el-col>
				<el-col>
					<div class="demo-drawer__footer">
						<el-button size="small" type="primary" @click="companyenter('ruleForm')" :loading="loading">
							{{ loading ? "提交中 ..." : "保 存" }}
						</el-button>
					</div>
				</el-col>
			</div>
		</el-drawer>
	</div>
</template>

<script>
	import Utils from "@/libs/Utils.js"
	export default {
		data() {
			let num = /^(0|\+?[1-9][0-9]*)$/
			let isNum = (rule, value, callback) => {
				if (!num.test(value)) {
					return callback(new Error("请输入非负整数"))
				} else {
					callback()
				}
			}
			let phone = /^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9]|17[0|1|2|3|5|6|7|8|9])\d{8}$/
			let isPhone = (rule, value, callback) => {
				if (value == undefined || value.length <= 0) callback()
				if (!phone.test(value)) {
					return callback(new Error("请输入正确格式的手机号"))
				} else {
					callback()
				}
			}
			let email = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
			let isEmail = (rule, value, callback) => {
				if (value == undefined || value.length <= 0) callback()
				if (!email.test(value)) {
					return callback(new Error("请输入正确格式的邮箱地址"))
				} else {
					callback()
				}
			}
			return {
				oldValA: {},
				oldValB: {},
				oldValC: {},
				oldValD: {},
				companyRules: {
					deptName: [{ required: true, message: "请输入部门名称", trigger: "blur" }],

					isVirtual: [{ required: true, message: "请选择虚拟公司", trigger: "blur" }],
					manager: [
						{
							min: 1,
							max: 10,
							message: "长度在 1 到 10 个字符",
							trigger: "blur",
						},
					],
					sortNum: [{ required: true, message: "请输排序", trigger: "blur" }, { validator: isNum }],
					name: [
						{ required: true, message: "请输入公司名称", trigger: "blur" },
						{
							min: 1,
							max: 20,
							message: "长度在 1 到 20 个字符",
							trigger: "blur",
						},
					],
					companyCode: [
						{ required: true, message: "请输入公司编码", trigger: "blur" },
						{
							min: 1,
							max: 20,
							message: "长度在 1 到 20 个字符",
							trigger: "blur",
						},
					],
					parentId: [{ required: true, message: "请选择上级公司", trigger: "blur" }],
					type: [{ required: true, message: "请选择公司类型", trigger: "blur" }],
					phone: [{ validator: isPhone }],
					email: [{ required: false, message: "请输入正确的邮箱", trigger: "blur" }, { validator: isEmail }],
				},
				// lazyTreeNodeMap:new Map(),
				lazyTreeNodeMap: {},
				ruleForm: {
					name: "",
					parentId: "",
					type: "",
					manager: "",
					phone: "",
					email: "",
					isVirtual: "非虚拟",
					address: "",
					remark: "",
					delFlag: "0",
					sortNum: "",
					parentCode: "",
					parentName: "",
					isWorkComp: "0",
					isProject: "0",
					istally: "0",
				},
				dialogVisible: false,
				dialog: false,
				deptAdd: false,
				dialogtwo: false,
				deptOrCom: "所属公司",
				loading: false,
				dialogtitle: "",
				vflag: false,
				companyTree: [],
				//树形控件的绑定对象
				treeProps: {
					children: "children",
					label: "name",
				},
				form: {
					delFlag: true,
					type: "00",
					companyCode: "",
					deptName: "",
					sortNum: "",
					id: "",
					companyName: "",
					deptCode: "",
					manager: "",
					phone: "",
					isVirtual: "非虚拟",
					islabor: "",
          isMachine: "",
				},
				formtwo: {
					name: "",
					parentId: "",
					type: "",
					manager: "",
					phone: "",
					email: "",
					isVirtual: "非虚拟",
					address: "",
					remark: "",
					delFlag: "0",
					id: "",
					sortNum: "",
					companyCode: "",
					isWorkComp: "0",
					isProject: "0",
					istally: "0",
				},
				formInline: {
					id: "",
					deptName: "",
					delFlag: "",
				},
				deptData: {
					delFlag: "0",
					type: "00",
					companyCode: "",
					deptName: "",
					sortNum: "",
					parentCode: "",
					parentId: "",
					companyName: "",
					manager: "",
					phone: "",
					isVirtual: "非虚拟",
					isProject: "0",
					islabor: "0",
          isMachine: "0",
				},
				optionProps: {
					value: "id",
					label: "name",
					children: "children",
				},
				cvflag: false, // 公司判断
				companyData: [],
				parentId: "",
				formLabelWidth: "150px",
				menuArr: [],
				timer: null,
				tableData: [],
				// tableHeight: window.innerHeight - 160,
				type: "",
			}
		},
		computed: {
			tableHeight() {
				return this.$store.state.tableHeight
			},
		},
		created() {},
		// async activated() {
		// 	var menuArr = []
		// 	var menuId = ""
		// 	if (localStorage.getItem("menuArr")) {
		// 		menuArr = JSON.parse(localStorage.getItem("menuArr"))
		// 	}
		// 	menuArr.map(item => {
		// 		item.children.map(v => {
		// 			if (window.location.href.includes(v.url)) {
		// 				menuId = v.id
		// 			}
		// 		})
		// 	})
    //
		// 	if (menuId) {
		// 		this.menuArr = []
		// 		await this.$http
		// 				.get(`/${this.$ServiceName}/api/external/sysmenubtn/listresourcebtnbyid?menuId=${menuId}`, { timeout: 30000 })
		// 				.then(res => {
		// 					res.data.data.map(item => {
		// 						this.menuArr.push(item.RESOURCENAME)
		// 					})
		// 				})
		// 				.catch(error => {})
		// 	}
    //
		// 	if (this.$store.state.app.searchResouce == "menu") {
		// 		this.type = ""
		// 		this.formInline = {
		// 			id: "",
		// 			deptName: "",
		// 			delFlag: "",
		// 		}
		// 		this.getDataList()
		// 		// 查询公司树
		// 		this.$http.get(`/${this.$ServiceName}/api/external/public/listcompanydepttree`, {}).then(res => {
		// 			if (res.status == 200) {
		// 				if (res.data.success) {
		// 					this.companyData = this.getTreeData(res.data.data)
		// 				} else {
		// 					return this.$message.warning(res.data.msg)
		// 				}
		// 			} else {
		// 				this.$message.warning("查询公司列表信息失败。状态码：" + res.status)
		// 			}
		// 		})
		// 		// 查询公司树
		// 		this.$http.get(`/${this.$ServiceName}/api/external/sysdept/selectcomptree`, {}).then(res => {
		// 			if (res.status == 200) {
		// 				if (res.data.success) {
		// 					this.companyTree = res.data.data
		// 				} else {
		// 					return this.$message.warning(res.data.msg)
		// 				}
		// 			} else {
		// 				this.$message.warning("查询公司列表树失败。状态码：" + res.status)
		// 			}
		// 		})
		// 	}
		// },
		methods: {
			async searchClick() {
				this.lazyTreeNodeMap = {}
				//  this.tableData = []
				let type = this.type ? this.type.join(",") : ""
				const res = await this.$http.get(
						`/${this.$ServiceName}/api/external/sysdept/selecttree?type=${type}&state=${this.formInline.delFlag}&name=${this.formInline.deptName}`
				)
				if (res.data.code != "0000") {
					return this.$message.error(res.data.msg)
				}

				this.tableData = res.data.data
				this.tableData = this.mapChildren(this.tableData)
        console.log(this.tableData,"部门")
			},
			async getDataList() {
				let type = this.type ? this.type.join(",") : ""
				const res = await this.$http.get(`/${this.$ServiceName}/api/external/sysdept/selecttree?type=${type}`)
				if (res.data.code != "0000") {
					return this.$message.error(res.data.msg)
				}
				// console.log(res)
				this.tableData = res.data.data
				this.tableData = this.mapChildren(this.tableData)
			},
			handleNodeClick(data) {
				this.ruleForm.parentId = data.id
				this.ruleForm.parentCode = data.companyCode
				this.ruleForm.parentName = data.name
			},
			// 关闭抽屉操作
			handleClose(done) {
				let oldV = {}
				let newV = {}
				if (this.dialog) {
					oldV = this.oldValA
					newV = this.form
				}
				if (this.deptAdd) {
					oldV = this.oldValB
					newV = this.deptData
				}
				if (this.dialogtwo) {
					oldV = this.oldValC
					newV = this.formtwo
				}
				if (this.dialogVisible) {
					oldV = this.oldValD
					newV = this.ruleForm
				}
				if (!Utils.compareData(oldV, newV)) {
					this.$confirm("修改的数据未保存，是否关闭？")
							.then(_ => {
								done()
							})
							.catch(_ => {})
				} else {
					done()
				}
			},
			// 递归判断列表，把最后的children设为undefined
			getTreeData(data) {
				for (var i = 0; i < data.length; i++) {
					if (data[i].children.length < 1) {
						// children若为空数组，则将children设为undefined
						data[i].children = undefined
					} else {
						// children若不为空数组，则继续 递归调用 本方法
						this.getTreeData(data[i].children)
					}
				}
				return data
			},
			casChange(va) {
				this.formtwo.parentId = va[va.length - 1]
				console.log(this.formtwo.parentId)
			},
			//点击取消重置新增框表单校验
			closedept(formName) {
				this.$refs[formName].resetFields()
				Object.assign(this.ruleForm, this.$options.ruleForm())
				this.dialogVisible = false
			},

			editDeptenter() {
				this.$refs["addDeptForm"].validate(async valid => {
					if (valid) {
						this.$http
								.put(`/${this.$ServiceName}/api/external/sysdept/update`, {
									id: this.form.id,
									companyId: this.form.companyCode,
									deptName: this.form.deptName,
									sortNum: this.form.sortNum,
									deptType: this.form.type,
									state: this.form.delFlag,
									deptCode: this.form.deptCode,
									manager: this.form.manager,
									phone: this.form.phone,
									isproject: this.form.isProject,
									islabor: this.form.islabor,
                  isMachine: this.form.isMachine,
									isVirtual: this.form.isVirtual == "虚拟" ? "00" : "01",
								})
								.then(res => {
									if (res.status == 200) {
										if (res.data.success) {
											window.sessionStorage.setItem("token", res.headers.token)
											this.tableData = res.data.data
											this.$message.success("修改部门成功！")
											this.dialog = false

											// this.onSubmit()
											this.searchClick()
										} else {
											this.$message.warning("修改部门信息失败，错误代码：" + res.data.code + res.data.msg)
										}
									} else {
										this.$message.warning("修改部门信息失败。状态码：" + res.status)
									}
								})
					}
				})
			},
			// 展开或关闭时触发
			expandChange(row, event) {
				if (!event) {
					this.closeCicle(row.id)
				}
			},
			//递归关闭表格
			closeCicle(rowId) {
				if (this.$refs.multipleTable.store.states.treeData[rowId].children.length > 10) {
					this.$refs.multipleTable.store.states.treeData[rowId].expanded = false
					this.$refs.multipleTable.store.states.treeData[rowId].loaded = false
					this.$set(this.$refs.multipleTable.store.states.lazyTreeNodeMap, rowId, [])
				}
				this.$refs.multipleTable.store.states.treeData[rowId].children.map(res => {
					// this.$set(this.$refs.multipleTable.store.states.treeData, res,{children:[],expanded:false,lazy:true,level:"",loaded:false,loading:false})
					if (this.$refs.multipleTable.store.states.treeData[res] != undefined) {
						this.$refs.multipleTable.store.states.treeData[res].expanded = false
						this.$refs.multipleTable.store.states.treeData[res].loaded = false
						this.$set(this.$refs.multipleTable.store.states.lazyTreeNodeMap, res, [])
						//    if(this.$refs.multipleTable.store.states.treeData[res].children.length != 0){
						//   this.$refs.multipleTable.store.states.treeData[res].children.map(item=>{
						//   })
						// }
						this.closeCicle(res)
					}
				})
			},
			//异步加载子列表
			getChildren(tree, treeNode, resolve) {
				this.$http.get(`/${this.$ServiceName}/api/external/sysdept/selectsecondtree?id=${tree.id}`).then(res => {
					console.log(res)
					if (res.data.success) {
						res.data.data.map(item => {
							item.childCount ? (item.hasChildren = true) : ""
						})
						console.log(res.data.data)
						resolve(res.data.data)
					}
				})
				// setTimeout(() => {
				//   resolve(this.lazyTreeNodeMap[tree.id] || [])
				// }, 500)
			},
			/** 递归树结构*/
			mapChildren(arr) {
				const newArr = []
				arr.forEach(item => {
					const obj = item
					if (item.children) {
						if (item.children == undefined || item.children.length == 0) {
							obj.hasChildren = false
						} else {
							// 保存对象children
							this.lazyTreeNodeMap[item.id] = this.mapChildren(item.children)
							obj.hasChildren = true
						}
						delete obj.children
					}
					newArr.push(obj)
				})
				return newArr
			},
			addDeptenter() {
				this.$refs["editForm"].validate(async valid => {
					if (valid) {
						this.$http
								.post(`/${this.$ServiceName}/api/external/sysdept/insert`, {
									companyId: this.deptData.companyCode,
									deptName: this.deptData.deptName,
									deptType: this.deptData.type,
									isVirtual: this.deptData.isVirtual == "虚拟" ? "00" : "01",
									sortNum: this.deptData.sortNum,
									state: this.deptData.delFlag ? "0" : "1",
									deptCode: this.deptData.parentCode,
									parentId: this.deptData.parentId,
									manager: this.deptData.manager,
									phone: this.deptData.phone,
									isproject: this.deptData.isProject,
									islabor: this.deptData.islabor,
                  isMachine: this.deptData.isMachine,
								})
								.then(res => {
									if (res.status == 200) {
										if (res.data.success) {
											this.tableData = res.data.data
											this.$message.success("新增部门成功！")
											this.deptAdd = false
											// this.onSubmit()
											this.searchClick()
											setTimeout(() => {
												this.deptData.isProject = "0"
												this.deptData.delFlag = "0"
												this.deptData.islabor = "0"
                        this.deptData.isMachine = "0"
											})
										} else {
											this.$message.warning("新增部门信息失败，错误代码：" + res.data.code + res.data.msg)
										}
									} else {
										this.$message.warning("新增部门信息失败。状态码：" + res.status)
									}
								})
					}
				})
			},
			// 新建
			create() {
				this.dialogVisible = true
				this.$nextTick(() => {
					this.$refs.ruleForm.resetFields()
					this.oldValD = JSON.parse(JSON.stringify(this.ruleForm))
				})
			},
			//提交新建表单
			companyenter(formName) {
				this.$refs[formName].validate(async valid => {
					if (valid) {
						var data = {
							address: this.ruleForm.address,
							parentId: this.ruleForm.parentId,
							phone: this.ruleForm.phone,
							remark: this.ruleForm.remark,
							isVirtual: this.ruleForm.isVirtual == "虚拟" ? "00" : "01",
							state: this.ruleForm.delFlag,
							email: this.ruleForm.email,
							manager: this.ruleForm.manager,
							companyType: this.ruleForm.type,
							companyName: this.ruleForm.name,
							companyCode: this.ruleForm.parentCode,
							sortNum: this.ruleForm.sortNum,
							isworkcomp: this.ruleForm.isWorkComp,
							istally: this.ruleForm.istally,
						}

						if (data.companyCode == "" || data.parentId == "") {
							let code = this.companyTree[0].companyCode
							data.companyCode = code.substr(0, code.length - 3)
							data.parentId = this.companyTree[0].parentId
						}
						this.$http.post(`/${this.$ServiceName}/api/external/syscompany/insert`, data).then(res => {
							if (res.status == 200) {
								if (res.data.success) {
									this.tableData = res.data.data
									this.dialogVisible = false
									// this.onSubmit()
									this.searchClick()
								} else {
									this.$message.warning("新增公司信息失败，错误代码：" + res.data.code + res.data.msg)
								}
							} else {
								this.$message.warning("新增公司信息失败。状态码：" + res.status)
							}
						})
					} else {
						return false
					}
				})
			},
			//单条查询
			onSubmit() {
				//查询全部公司部门树形表
				this.$http
						.get(
								`/${this.$ServiceName}/api/external/sysdept/selecttree?state=` +
								this.formInline.delFlag +
								(this.formInline.deptName.length > 0 ? "&name=" + this.formInline.deptName : ""),
								{}
						)
						.then(res => {
							if (res.status == 200) {
								if (res.data.success) {
									this.tableData = res.data.data
								} else {
									return this.$message.warning(res.data.msg)
								}
							} else {
								this.$message.warning("查询公司部门信息失败。状态码：" + res.status)
							}
						})
			},
			// 修改
			handleEdit(index, row) {
				if (row.deptOrCompany == "公司") {
					if (row.children && row.children.length !== 0) {
						this.cvflag = true
					}
					this.dialogtwo = true
					this.formtwo.name = row.name
					this.formtwo.parentId = row.parentId
					this.formtwo.type = row.type
					this.formtwo.manager = row.manager
					this.formtwo.phone = row.phone
					this.formtwo.email = row.email
					this.formtwo.isVirtual = row.isVirtual == "00" ? "虚拟" : "非虚拟"
					this.formtwo.address = row.address
					this.formtwo.remark = row.remark
					this.formtwo.delFlag = row.state
					this.formtwo.id = row.id
					this.formtwo.sortNum = row.sortNum
					this.formtwo.companyCode = row.companyCode
					this.formtwo.isWorkComp = row.isworkcomp
					this.formtwo.isProject = row.isproject
					this.formtwo.istally = row.istally ? row.istally : "0"

					this.parentId = row.parentId

					this.oldValC = JSON.parse(JSON.stringify(this.formtwo))
				} else if (row.deptOrCompany == "部门") {
					if (this.ruleForm.isVirtual === "虚拟") {
						this.vflag = true
					} else {
						this.vflag = false
					}
					this.dialog = true
					this.form.delFlag = row.state
					this.form.type = row.type
					this.form.companyCode = row.parentId
					this.form.deptName = row.name
					this.form.sortNum = row.sortNum
					this.form.id = row.id
					this.form.deptCode = row.companyCode
					this.form.companyName = row.companyName
					this.form.manager = row.manager
					this.form.phone = row.phone
					this.form.islabor = row.islabor
          this.form.isMachine = row.isMachine
					if (this.formtwo.isVirtual === "虚拟") {
						this.form.isVirtual = "虚拟"
					} else {
						this.form.isVirtual = row.isVirtual == "00" ? "虚拟" : "非虚拟"
					}
					this.oldValA = JSON.parse(JSON.stringify(this.form))
				}
			},
			//新增
			handleCreate(index, row) {
				this.deptData = {
					delFlag: "0",
					type: "00",
					companyCode: "",
					deptName: "",
					sortNum: "",
					parentCode: "",
					parentId: "",
					companyName: "",
					manager: "",
					phone: "",
					isVirtual: "非虚拟",
					isProject: "0",
					islabor: "0",
          isMachine: "0",
				}
				if (this.ruleForm.isVirtual === "虚拟") {
					this.vflag = true
					this.deptData.isVirtual = "虚拟"
				} else {
					this.vflag = false
				}
				this.deptAdd = true
				console.log(row)
				this.deptData.parentId = row.id
				this.deptData.companyCode = row.id
				this.deptData.parentCode = row.companyCode
				this.deptData.companyName = row.name
				if (row.deptOrCompany == "公司") {
					this.deptOrCom = "所属公司"
				} else if (row.deptOrCompany == "部门") {
					this.deptData.companyCode = row.companyId
					this.deptOrCom = "所属部门"
				}
				this.oldValB = JSON.parse(JSON.stringify(this.deptData))
			},

			handleDelete(index, row) {
				if (row.deptOrCompany == "公司") {
					this.$http.delete(`/${this.$ServiceName}/api/external/syscompany/deletebyid?id=` + row.id).then(res => {
						if (res.status == 200) {
							if (res.data.success) {
								this.tableData = res.data.data
								this.$message.success("删除公司成功！")

								// this.onSubmit()
								this.searchClick()
							} else {
								this.$message.warning("删除公司信息失败，错误代码：" + res.data.code + res.data.msg)
							}
						} else {
							this.$message.warning("删除公司信息失败。状态码：" + res.status)
						}
					})
				} else if (row.deptOrCompany == "部门") {
					this.$http.delete(`/${this.$ServiceName}/api/external/sysdept/deletebyid?id=` + row.id).then(res => {
						if (res.status == 200) {
							if (res.data.success) {
								this.tableData = res.data.data
								this.$message.success("删除部门成功！")

								// this.onSubmit()
								this.$refs.multipleTable.store.states.lazyTreeNodeMap[row.parentId].length - 1 == 0
										? this.$set(this.$refs.multipleTable.store.states.lazyTreeNodeMap, row.parentId, [])
										: ""
								this.searchClick()
							} else {
								this.$message.warning("删除部门信息失败，错误代码：" + res.data.code + res.data.msg)
							}
						} else {
							this.$message.warning("删除部门信息失败。状态码：" + res.status)
						}
					})
				}
			},

			cancelForm() {
				this.loading = false
				this.dialog = false
			},

			cancelFormtwo() {
				this.dialogVisible = false
			},

			submitComEdit(formName) {
				this.$refs[formName].validate(async valid => {
					if (valid) {
						var data = {
							address: this.formtwo.address,
							parentId: this.formtwo.parentId,
							phone: this.formtwo.phone,
							remark: this.formtwo.remark,
							isVirtual: this.formtwo.isVirtual == "虚拟" ? "00" : "01",
							state: this.formtwo.delFlag,
							email: this.formtwo.email,
							manager: this.formtwo.manager,
							companyType: this.formtwo.type,
							companyName: this.formtwo.name,
							id: this.formtwo.id,
							sortNum: this.formtwo.sortNum,
							companyCode: this.formtwo.companyCode,
							isworkcomp: this.formtwo.isWorkComp,
							istally: this.formtwo.istally,
						}

						this.$http.put(`/${this.$ServiceName}/api/external/syscompany/update`, data).then(res => {
							if (res.status == 200) {
								if (res.data.success) {
									this.dialogtwo = false
									this.tableData = res.data.data
									this.$message.success("修改公司信息成功！")

									// this.onSubmit()
									this.searchClick()
								} else {
									this.$message.warning("修改公司信息失败，错误代码：" + res.data.code + res.data.msg)
								}
							} else {
								this.$message.warning("修改公司信息失败。状态码：" + res.status)
							}
						})
					} else {
						return false
					}
				})
			},
		},
	}
</script>

<style lang="less" scoped>
	// @import '../../../assets/table';
	/deep/ .el-table th:last-child {
		border-left: none;
	}
	/deep/ .el-table th > .cell {
		font-family: PingFangSC-Semibold;
		font-size: 14px;
		color: #606266;
	}
	/deep/ .el-table .cell {
		white-space: nowrap;
	}
	/deep/ .el-table th {
		height: 41px !important;
	}

	/deep/ .el-table tr {
		height: 41px !important;
	}
	/deep/ .el-table th {
		border-left: 1px solid #ebeef5;
		border-right: none;
		// border-bottom: none !important;
	}

	/deep/ .el-table th:nth-child(1) {
		border-left: none;
	}
	/deep/ .el-table td {
		border-right: none;
	}
	/deep/ .el-button--primary {
		background-color: #338ce8;
		border-color: #338ce8;
	}

	/deep/ .el-collapse-item__header {
		background: #f5f7fa;
	}

	/deep/ #el-drawer__title {
		background: #f5f7fa;
	}
	#fiefooter /deep/ .el-select {
		width: 100%;
	}
	.yesgoods /deep/ .el-drawer__body {
		padding-top: 0;
	}
	.yesgoods .anniu {
		text-align: right;
		padding: 10px 20px 10px;
	}
	#card /deep/ .el-form-item__content {
		margin: 0;
	}
	/deep/ .el-button + .el-button {
		margin-left: 0;
	}
	/deep/ .el-drawer__header {
		// margin-bottom: 12px;
		height: 40px;
		line-height: 41px;
		padding: 0 16px;
		box-sizing: border-box;
		border-bottom: 1px solid gainsboro;
		margin-bottom: 0;
	}

	/deep/ .el-drawer__open .el-drawer.rtl {
		background: #f5f7fa;
	}

	/deep/ .el-drawer__body {
		overflow-y: auto;
		padding-bottom: 50px;
	}
	// /deep/ .el-form-item__content {
	//   margin: 0 51px 0 134px;
	// }
	/deep/ .el-collapse-item__header {
		padding-left: 19px;
		font-size: 16px;
	}
	/deep/ .el-breadcrumb {
		font-size: 16px;
	}
	/* 第一行居中 */
	.el-table td:first-child,
	el-table th:first-child,
	.el-table td:last-child,
	el-table th:last-child {
		text-align: center !important;
	}

	.department {
		.form_card {
			display: flex;
			align-items: center;
			justify-content: space-between;
			.el-form-item {
				margin-bottom: 0;
			}
		}
		/deep/.el-card__body {
			width: 100%;
			padding: 0;
			border-radius: 0;
		}
		/deep/.el-pagination.is-background .btn-next,
		/deep/ .el-pagination.is-background .btn-prev,
		/deep/ .el-pagination.is-background .el-pager li {
			background: #ffffff;
			border: 1px solid #e1e4eb;
			border-radius: 3px;
			border-radius: 3px;
		}
		.editBtn,
		.deleteBtn {
			color: #1684f6;
			border-color: transparent;
			background: transparent;
		}
		//分页
		.card_pagination {
			text-align: right;
		}
		.el-scrollbar .el-scrollbar__wrap .el-scrollbar__view {
			white-space: nowrap;
		}
	}
	.el-table {
		margin-bottom: 0 !important;
	}

	.el-table td {
		padding: 10px 0;
		text-align: left;
	}
	/deep/.el-drawer .rtl {
		overflow: no-display;
	}
	.box {
		border: 1px solid #e1e4eb;
		border-radius: 4px 4px 0 0;
		border-top: none;
	}
</style>
